<!-- 基本信息 -->

<template>
  <div class="RepairList-MyBase">
    <MajorTitle title="基本信息" />

    <FormInputTip
      label="提单人"
      bind="releaseUserName"
      :query="queryName"
      :max="20"
      hasRight
      rightKey="phone"
      required
      @select="toSelect"
      @clear="toClear()"
    />

    <FormInputTip
      label="联系电话"
      bind="releaseUserPhone"
      :query="queryPhone"
      :max="20"
      hasRight
      rightKey="phone"
      @select="toSelect"
    />

    <FormSelect v-if="release_chosen.id" v-bind="organProp" :dict="organDict" @change="changeOrganId" />
    <FormTree v-else v-bind="organProp" :dict="CORE.ORGAN.DICT" @change="changeOrganId" />
  </div>
</template>

<script>
// ============================== 导入依赖 ============================== //

import CORE from '@/CORE'

// ============================== 导出组件 ============================== //

export default {
  /**
   * 名称定义 (实际使用名称)
   */
  name: 'MyBase',

  /**
   * 混入列表 (配置选项合并)
   */
  mixins: [
    CORE.mixWeb('add'),
    CORE.mix(CORE.STORE.SELECT, 'release', 'release_'),
    CORE.mix(CORE.STORE.SELECT, 'history', 'history_'),
  ],

  /**
   * 状态数据 (函数返回对象)
   */
  data() {
    return {
      callback: null, // 回调方法
    }
  },

  /**
   * 计算属性 (慎用箭头函数)
   */
  computed: {
    /**
     * 组织字段
     */
    organProp: () => ({
      label: `所属${CORE.MAP.ORGAN}`,
      bind: 'organizationId',
    }),

    /**
     * 组织字典
     */
    organDict() {
      const { organId } = this.release_chosen
      if (CORE.isEmpty(organId)) return []
      return organId.map(id => [id, (CORE.ORGAN.MAP[id] || {}).name || ''])
    },
  },

  /**
   * 监听属性 (深度 deep 首次 immediate)
   */
  watch: {
    /**
     * 监听提单人的下拉开关
     */
    release_needSelect(need) {
      if (!need) this.callback(this.release_readySelect ? this.release_select : []) // 关闭时
    },
  },

  /**
   * 本地方法 (轻量重要在前)
   */
  methods: {
    /**
     * 查询名称
     */
    queryName(name, callback) {
      this.toClear('name', name) // 先清空
      CORE.merge(this.release_selectParam, { name, phone: '' }) // 设置下拉参数
      this.release_startSelect() // 打开下拉开关
      this.callback = callback // 记录回调函数
    },

    /**
     * 查询手机
     */
    queryPhone(phone, callback) {
      CORE.merge(this.release_selectParam, { phone, name: '' }) // 设置下拉参数
      this.release_startSelect() // 打开下拉开关
      this.callback = callback // 记录回调函数
    },

    /**
     * 点击选择
     */
    toSelect(chosen) {
      const organId = chosen.organId[0] || ''
      this.release_setChosen(chosen)
      this.changeUser(chosen)
      this.changeOrganId(organId)
      this.history_selectParam.releaseUserId = chosen.uaaUserId || ''
      this.history_startSelect()
    },

    /**
     * 点击清除
     */
    toClear(keepKey, value) {
      this.release_setChosen()
      this.release_setSelect()
      this.changeUser({}, keepKey, value)
      this.changeOrganId()
      this.history_selectParam.releaseUserId = ''
      this.history_startSelect()
    },

    /**
     * 切换用户
     */
    changeUser(user, keepKey, value) {
      CORE.merge(this.one, {
        releaseUserId: user.uaaUserId || '',
        releaseUserName: keepKey === 'name' ? value : user.name || '',
        releaseUserPhone: keepKey === 'phone' ? value : user.phone || '',
      })
    },

    /**
     * 切换组织 ID
     */
    changeOrganId(organId) {
      const organ = CORE.ORGAN.MAP[organId] || {}
      CORE.merge(this.one, {
        organizationId: organId || undefined, // 跟 FormSelect 和 FormTree 的空值 undefined 一致，以防死循环
        organizationName: organ.name || '',
        organizationAreaId: organ.regionId || '',
        organizationAreaName: organ.regionName || '',
        areaId: organ.regionId || '',
        areaName: organ.regionName || '',
      })
    },
  },
}
</script>

<style lang="scss">
@import './index.scss';
</style>
